@import '../../styles/theme.less';

.breadcrumb {
  margin-bottom: @margin-lg;
  padding: @padding-md @padding-lg;
  background: #fff;
  border-radius: @border-radius-base;
  box-shadow: @box-shadow-base;

  :global(.ant-breadcrumb) {
    font-size: 14px;
  }
}

.noticeCard {
  background: #fff;
  border-radius: @border-radius-base;
  box-shadow: @box-shadow-base;
  transition: all 0.3s;

  &:hover {
    box-shadow: @box-shadow-hover;
  }

  :global {
    .ant-card-head {
      padding: @padding-md @padding-lg;
      border-bottom: 1px solid #f0f0f0;
      background: linear-gradient(to right, rgba(24, 144, 255, 0.05), transparent);

      .ant-card-head-title {
        font-size: 16px;
        font-weight: 600;
        color: @text-color;
      }

      .ant-card-extra {
        .ant-btn {
          border-radius: 20px;
          height: 32px;
          padding: 0 16px;
          
          &-primary {
            background: @gradient-primary;
            border: none;
            
            &:hover {
              background: linear-gradient(135deg, lighten(#1890ff, 5%) 0%, lighten(#096dd9, 5%) 100%);
            }
          }
        }
      }
    }

    .ant-table {
      .ant-table-thead > tr > th {
        background: #fafafa;
        font-weight: 500;
        padding: @padding-md;
        border-bottom: 1px solid #f0f0f0;
      }

      .ant-table-tbody > tr {
        td {
          padding: @padding-md;
          transition: all 0.3s;
        }

        &:hover {
          td {
            background: rgba(24, 144, 255, 0.05);
          }
        }

        .notice-title {
          color: @text-color;
          font-weight: 500;
          display: flex;
          align-items: center;
          gap: @padding-sm;

          .ant-tag {
            margin: 0;
            padding: 2px 8px;
            border-radius: 10px;
            font-size: 12px;
            font-weight: normal;

            &-red {
              background: rgba(255, 77, 79, 0.1);
              border: none;
              color: #ff4d4f;
            }
          }
        }

        .notice-type {
          .ant-tag {
            margin: 0;
            padding: 4px 12px;
            border-radius: 12px;
            font-size: 12px;
            border: none;
            background: rgba(24, 144, 255, 0.08);
            color: @primary-color;
          }
        }

        .notice-time {
          color: @text-color-secondary;
          font-size: 13px;
        }

        .notice-actions {
          .ant-btn-link {
            padding: 4px 8px;
            height: auto;
            font-size: 14px;
            transition: all 0.3s;

            &:hover {
              background: rgba(24, 144, 255, 0.05);
              border-radius: 4px;
            }

            &:not(:last-child) {
              margin-right: @margin-sm;
            }
          }
        }
      }

      .ant-table-pagination {
        margin: @margin-lg @padding-lg;

        .ant-pagination-total-text {
          color: @text-color-secondary;
        }
      }
    }
  }
}

// 添加动画效果
.fade-in {
  animation: fadeIn 0.3s ease-out;
}

@keyframes fadeIn {
  from {
    opacity: 0;
    transform: translateY(20px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.container {
  display: flex;
  min-height: calc(100vh - 64px);
}

.content {
  flex: 1;
  padding: 24px;
  background: #f0f2f5;
  min-height: 100%;
}

// ... 其他样式保持不变 